<!doctype html>

<html>
	<head>
		<meta charset="utf-8">
		<title>Rumpetroll! — It's norwegian, but probably not what you think</title>
		<link rel="stylesheet" type="text/css" href="css/main.css" />
		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=0;" />		
		<meta name="apple-mobile-web-app-capable" content="YES">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="apple-touch-icon" href="images/apple-touch-icon.png"/>
		<meta name="title" content="Rumpetroll!" />
		<meta name="description" content="A massive multiplayer experiement done in HTML5/Canvas/JS and magical websockets. Rumpetroll is norwegian, but probably not what you think" />
		<link rel="image_src" href="images/fb-image.jpg" / >
	</head>
	<body>
		<canvas id="canvas"></canvas>
		
		<div id="ui">
			<div id="fps"></div>
		
			<input id="chat" type="text" />
			<div id="chatText"></div>
		
			<h1>Rumpetroll</h1>
		
			<div id="instructions">
				<h2>Instructions</h2>
				<p>Click &amp; hold to swim – type to chat!<br />Type 'name: yourname'</p>
			</div>
		   
		   <div id="fwa">
		   
		    <a href="http://www.thefwa.com/site/rumpetroll" title="Rumpetroll on Favorite Website Awards"> <img src="images/fwa.png" alt="fwa"></a>
		   </div><!-- #fwa -->

			<aside id="info">
				<section id="share">
					<a rel="external" href="https://github.com/firenio/firenio" title="danielmahal's Rumpetroll at GitHub">
						<img src="css/images/github.png" alt="fork on github">
					</a>
				</section>
				<section id="wtf">
				   <h2>WTF is "rumpetroll"?</h2>
			      <p><a rel="external" href="http://rumpetroll.com/wtfisrumpetroll/">Glad you asked…</a></p>
				</section>
				<section id="concept">
					<h2>Created with scandinavian love by:</h2>
					<ul>
						<li><a rel="external" href="http://www.twitter.com/danielmahal">@danielmahal</a></li>
						<li><a rel="external" href="http://www.twitter.com/hpeikemo">@hpeikemo</a></li>
						<li><a rel="external" href="http://www.twitter.com/hugoahlberg">@hugoahlberg</a></li>
						<li><a rel="external" href="http://www.twitter.com/simenbrekken">@simenbrekken</a></li>
					</ul>
				</section>
			</aside>
            <aside id="frogMode">
                <h3>Frog Mode</h3>
                <section id="tadpoles">
                    <h4>Tadpoles</h4>
                    <ul id="tadpoleList">
                    </ul>
                </section>
                <section id="console">
                    <h4>Console</h4>
                </section>
            </aside>
			
			<div id="cant-connect">
				Ooops. Did you do this?<br />Our <a href="http://www.firenio.com" >Mother-frog</a> is unable to deliver you to the primordial multiplayer pond.<br />Please <a href="http://www.firenio.com" title="Rumpetroll">try again</a> later to play with other Rumpetrolls.
			</div>
			<div id="unsupported-browser">
				<p>Dear aspiring Rumpetroll.<br />
					Mother frog says your browser doesn't support our technology. Either it is too old or <a rel="external" href="http://en.wikipedia.org/wiki/WebSocket">WebSockets</a> is disabled.
					We recommend one of the following browsers.
				</p>
				<ul>										
					<li><a rel="external" href="http://www.google.com/chrome">Google Chrome</a></li>
					<li><a rel="external" href="http://apple.com/safari">Safari 4</a></li>
					<li><a rel="external" href="http://www.mozilla.com/firefox/">Firefox 4</a></li>
					<li><a rel="external" href="http://www.opera.com/">Opera 11</a></li>
				</ul>
				<p>
					<a href="#" id="force-init-button">I don't care. Let me in!</a>
				</p>
			</div>
			
		</div>

		<script src="js/lib/parseUri.js"></script>                
		<script src="js/lib/modernizr-1.5.min.js"></script>                
		<script src="https://cdn.bootcss.com/jquery/1.4.2/jquery.min.js"></script>
		<script src="js/lib/Stats.js"></script>
		
		<script src="js/App.js"></script>
		<script src="js/Model.js"></script>
		<script src="js/Keys.js"></script>
		<script src="js/WebSocketService.js"></script>
		<script src="js/Camera.js"></script>
		
		<script src="js/Tadpole.js"></script>
		<script src="js/TadpoleTail.js"></script>
		
		<script src="js/Message.js"></script>
		<script src="js/WaterParticle.js"></script>
		<script src="js/Arrow.js"></script>
		<script src="js/formControls.js"></script>
		
		<script src="js/main.js"></script>
		<!--
		<script src="js/analytics.js"></script>
		
		<script type="text/javascript" src="http://use.typekit.com/znu4fui.js"></script> 
		<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
		-->
	</body>
</html>

